<template>
  <div class="about">
    {{a}}
  </div>
</template>
<script lang="ts" setup>
// 基本数据类型
let  a:string="哈哈哈哈"
  //  a=10
  //  console.log(a,'11');

// 引用数据类型
    // 两种方式  
        // 1 数组
// let arr: number[]=[1,0,3,4,5,10]
  let  arr:Array<number> = [1,0,3,4,5,10]
  // console.log(arr);
  // arr.push('lllll')
        // 2 对象
      function creates(obj:object){
        console.log(obj,'21');
        
      }
      creates({key:'llllllll'})

  // 元祖类型 多个类型  l类型位置不能变
  // let arr1:[number,string]=[0,'111']
  // console.log(arr1);

  // let arrr:string[]=['11','22','33','44']
  // 联合类型  多个类型合成一个类型
  // let arr2:string | number='啦啦啦'   位置可以随意变换  不用位置和类型一一对应
  let  arr2:(number| string) []=['111','555',0]
  console.log(arr2);
  
//  枚举类型
 enum Color{
   pink,
   red,
   yellow,
   green
 }
 let col=Color.green 
    // 名字.属性 返回的是相对应的下标
 console.log(col,'42');
 
 
 
  

  // 类型别名
 type newsarr=(number |string) []
 let arr5:newsarr=['1111','20',0]
 console.log(arr5);
 
  
  // 函数类型
  //  第一种方式
  // function adds(num1:number ,num2:number):number {
  //   return num1+num2
  // }
// console.log(adds(10,5));

  // 第二种方式  用类型别名去生成
  type fns=(num1:number,num2:number) =>number
  let adds:fns=(num1,num2)=>{
    return num1+num2
  }
  console.log(adds(20,5));
  

  // 泛型 指的是在定义函数 接口或类的时候 不预先指定具体的类型 而是在使用的时候
  // 在指定一种类型的特性
  /**
   * 表现形式  由尖括号包裹 <T > t指的是type，在定义
   */
  function  getData1<T>(arg:T):T{
    return arg
  }
  
  // console.log(getData1(15));
  // 调用的时候任何类型都可以
  // console.log(getData1('123456'));
  // console.log(getData1(true));
  //  泛型传入多个值
    function swap<T,U>(tuple:[T,U]) :[U,T]{
      return [tuple[1],tuple[0]]
    }
    // console.log(swap(['string',123456]));
    console.log(swap([15520,'122333']));
    
    // 接口定义   增加或减少变量是不允许的 改变数据类型也是不允许的
      // 接口名字 首字母要大写 以;结尾
    interface Iuser{
      name:string;
      age:number
    }
    // 可选属性   可写可不写
    interface Iuser2{
      name:string;
      age:number;
      sex?:string;    //可选属性
    }
    let tem1:Iuser2={
      name:"哈哈哈哈",
      age:18,
      sex:"nan"
    }
    console.log(tem1,'108');
    
  //  只读属性
  interface Iuser3{
     readonly id:number;
     name:string;
     age:number
  }
  // let tem3:Iuser3={
  //   name:"555",
  //   age:18
  // }
  // console.log(tem3);
  


  // 交叉类型  将多个接口类型合并成一个类型 从而实现等同接口继承的效果，也就是所谓的合并接口类型
  interface Iname{
    name:string
  }
  type IPerson=Iname &{status:boolean}
  let type9:IPerson={name:"小杨", status:true}
   console.log(type9,'130行');

  //  void 没有返回值
  const say=():void=>{
    console.log('hi');
    
  }
  console.log(say,'138');
  //  函数类型
  // 第一种写法
  // function add(num1:number,num2:number):number{
  //   return num1+num2
  // }
  // console.log(add(10,52.2));
  // 第二种写法
  const add=(num1:number,num2:number):number=>{
    return  num1+num2
  }
  console.log(add());
  
  
  
   
  

</script>

